<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<!--定义画布容器，给个边框省的你们找不到-->
<canvas id="myCanvas" width="400" height="400" style="border:1px solid #d3d3d3;">
    Your browser does not support the HTML5 canvas tag.
</canvas>
</body>
<script>
    var canvas = document.getElementById('myCanvas');

    var context = canvas.getContext('2d');


    var x = 200;

    var y = 200;

    let r = 100;

    var radius = 3; // 线之间的距离
    let hd = 2;//弧度
    let cos = Math.cos(Math.PI / 6);
    let sin = Math.sin(Math.PI / 6);
    let offsetX = r * cos
    let offsetY = r * sin
    //六条边
    let pointArray = [
        {
            start: {x: x + radius, y: y - r + radius},
            end: {x: x + offsetX - radius, y: y - offsetY - radius}
        },
        {
            start: {x: x + offsetX, y: y - offsetY + radius},
            end: {x: x + offsetX, y: y + offsetY - radius}
        },
        {
            start: {x: x + offsetX - radius, y: y + offsetY + radius},
            end: {x: x + radius, y: y + r - radius}
        },
        {
            start: {x: x - radius, y: y + r - radius},
            end: {x: x - offsetX + radius, y: y + offsetY + radius}
        },
        {
            start: {x: x - offsetX, y: y + offsetY - radius},
            end: {x: x - offsetX, y: y - offsetY + radius}
        },
        {
            start: {x: x - offsetX + radius, y: y - offsetY - radius},
            end: {x: x - radius, y: y - r + radius}
        }
    ]
    context.beginPath();
    for (let i = 0; i < 6; i++) {
        context.moveTo(pointArray[i].start.x, pointArray[i].start.y);
        context.lineTo(pointArray[i].end.x, pointArray[i].end.y);
        context.stroke()
    }

    context.moveTo(pointArray[0].start.x, pointArray[0].start.y); // 起点
    context.quadraticCurveTo(x, y-r+hd, pointArray[5].end.x, pointArray[5].end.y);
    context.lineWidth = 3
    context.stroke()


    // context.beginPath();
    // context.moveTo(x, y-r); // 起始点
    // context.lineTo(x+offsetX-radius, y-offsetY-radius)
    // context.closePath();
    // // 设置线条样式
    // context.strokeStyle = 'black';
    // context.lineWidth = 2;
    // // 描边
    // context.stroke();
    //
    // context.beginPath();
    // context.moveTo(x+offsetX, y-offsetY+radius)
    // context.lineTo(x+offsetX, y+offsetY)
    // context.closePath();
    // // 设置线条样式
    // context.strokeStyle = 'black';
    // context.lineWidth = 2;
    // // 描边
    // context.stroke();
    //
    // context.beginPath();
    // context.moveTo(x+offsetX-radius, y-offsetY-radius); // 起点
    // context.quadraticCurveTo(x+offsetX+0.2, y-offsetY-0.2, x+offsetX, y-offsetY+radius); // 控制点(200,100)，结束点(400,200)
    // context.stroke();
    let GM={
        'max_area': 0.4609655398917494,
        'max_area_rectangle':[114.8837890625, 80.15924072265625, 452.2198486328125, 639.87255859375]
    }




    let a = {
        "code": 0,
        "message": "",
        "data": {
        "code": "Success",
            "returnData": {
            "flag": [
                "耵聍较多",
                "发现真菌"
            ],
                "feature_con": [
                "霉菌感染耳道会导致耳道出现炎症，炎症刺激会导致耳道黏膜以及鼓膜充血、水肿，还会导致耳道分泌物增多，这会影响声音的传导，从而导致听力下降。如果霉菌感染比较严重，还可能会导致外耳道皮肤以及鼓膜受到损伤，从而引起听力下降的情况，需要注意。",
                "真菌感染通常会导致耳道内的分泌物异常增多，这些分泌物通常是干痂状，容易堵塞耳道，造成耳部闷堵感，并可能导致听力下降，需要注意。",
                "真菌感染，严重情况下可能会引起耳部堵塞感。",
                "真菌感染耳道通常会导致耳内深部发痒或奇痒，并有闷胀感，有时会反复搔刮或搔抓至破皮后才解痒。此外，脱落的耳道上皮与菌丝共同形成痂皮，阻塞耳道或覆盖在鼓膜表面，也会引起耳内堵塞感、听力减退及耳鸣等症状，需要注意。",
                "真菌感染，可能会引起耳部疼痛。"
            ],
                "AI_suggest_con": [
                "保持耳道干燥，避免过度清洁，避免长时间处于潮湿环境中，如游泳、沐浴后及时擦干耳朵，以降低真菌滋生的机会。",
                "避免使用锐利的工具或棉签深入耳道内，以减少对耳道皮肤的刺激和损伤。",
                "避免共享个人物品：如耳塞、棉签等，以避免交叉感染。"
            ],
                "Score": {
                "GHBF": 0,
                    "DNF": 0,
                    "CXF": 0,
                    "CKF": 0,
                    "HPSF": 0,
                    "MJF": 96,
                    "FMWF": 0,
                    "PHF": 0,
                    "AllJKF": 78,
                    "DNJKF": 97,
                    "GMJKF": 91,
                    "GMJKZH": 93,
                    "SortNumber": "34%"
            },
            "area": {
                "GM": {
                    "total_area": 0,
                        "max_area": 0,
                        "max_area_rectangle": null
                },
                "CT": {
                    "total_area": 0,
                        "max_area": 0,
                        "max_area_rectangle": null
                },
                "GHB": {
                    "total_area": 0,
                        "max_area": 0,
                        "max_area_rectangle": null
                },
                "DN": {
                    "total_area": 0,
                        "max_area": 0,
                        "max_area_rectangle": null
                },
                "CX": {
                    "total_area": 0,
                        "max_area": 0,
                        "max_area_rectangle": null
                },
                "CK": {
                    "total_area": 0,
                        "max_area": 0,
                        "max_area_rectangle": null
                },
                "HPS": {
                    "total_area": 0,
                        "max_area": 0,
                        "max_area_rectangle": null
                },
                "PH": {
                    "total_area": 0,
                        "max_area": 0,
                        "max_area_rectangle": null
                },
                "SH": {
                    "total_area": 0,
                        "max_area": 0,
                        "max_area_rectangle": null
                },
                "MJ": {
                    "total_area": 0.9405144996664603,
                        "max_area": 0.9405144996664603,
                        "max_area_rectangle": [
                        34.87060546875,
                        3.384521484375,
                        640,
                        640
                    ]
                },
                "FMW": {
                    "total_area": 0,
                        "max_area": 0,
                        "max_area_rectangle": null
                }
            },
            "img": "https://api.cgi-gz.com/img/65a13429abbf4.jpg",
                "result_img": "https://api.cgi-gz.com/result/T0112819277/65a13429abbf4.jpg",
                "img_name": "65a13429abbf4.jpg"
        },
        "sick_flag": {
            "DN_Flag": 1,
                "MJ_Flag": 1
        }
    }
    }
    function drawLine() {

    }
</script>
</html>